<!doctype html>
<html lang="en" ng-app="shareApp">
<head>
	<meta charset="UTF-8">
    <title>活动详情</title>
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta name="format-detection" content="telephone=no" />
    <link href="http://66xiaoqu.babytreeimg.com/css/66.css" rel="stylesheet" type="text/css" />
</head>
<body ng-controller="ActivityDetailCtrl" class="activedetail-body">
	<div class="wrapper activedetail">
		 <div class="swiper-container">
            <div class="swiper-wrapper">
            </div>
            <div class="pagination"></div>
        </div>
        <div class="clearfix count">
        	<span class="fl">已参加<em class="num">{{activity.partakeCount}}<sub>人</sub></em></span>
        	<span class="fr">费用<em class="num">{{activity.charge}}<sub>元/位</sub></em></span>
        </div>
        <div class="time-address">
         	<p><span class="time"><img src="http://66xiaoqu.babytreeimg.com/images/share/active_time.png">活动时间</span>{{activity.beginDate}}至{{activity.endDate}}</p>
         	<p><span class="address"><img src="http://66xiaoqu.babytreeimg.com/images/share/active_address.png">活动地点</span>{{address}}</p>
        </div>
        <p class="detail-t"><span>活动详情</span></p>
        <p class="detail-p">{{activity.desc}}</p>
        <p class="detail-t"><span>活动说明</span></p>
        <ul class="explain">
        	<li>{{activity.explain}}</li>
		</ul>
		<div class="h48"></div>
		<a href="javascript:;" class="join-a">我要报名</a>
    </div>	
     <div class="pop cancleJon">
     	<div class="cancleJon-con"><img src="http://66xiaoqu.babytreeimg.com/images/share/active_ok.png"><br/>报名成功</div>
     </div>
</body>
<div class="pop information">
	<form onclick="return false" class="info-form">
		<a href="javascript:;" class="close"></a>
		<p class="info-form-t">填写报名信息</p>
		<input type="text" placeholder="请输入手机号" class="text" maxlength="11" ng-model="phone" value=""/>
		<textarea placeholder="请输入备注信息" class="text address" ng-model="desc"/></textarea>
		<input type="submit" value="报名参加" class="button" ng-click="partake()">
	</form>
</div>
</html>
<script src="http://66xiaoqu.babytreeimg.com/js/controller/common.js" type="text/javascript"></script>
<script src="http://66xiaoqu.babytreeimg.com/js/lib/jquery-2.1.1.min.js" type="text/javascript"></script>
<script src="http://66xiaoqu.babytreeimg.com/js/lib/idangerous.swiper.js" type="text/javascript"></script>
<script src="http://66xiaoqu.babytreeimg.com/js/lib/angular.min.js" type="text/javascript"></script>
<script src="http://66xiaoqu.babytreeimg.com/js/lib/angular-route.min.js" type="text/javascript"></script>
<script src="http://66xiaoqu.babytreeimg.com/js/lib/angular-resource.min.js" type="text/javascript"></script>
<script src="http://66xiaoqu.babytreeimg.com/js/share/share.js"></script>
<script src="http://66xiaoqu.babytreeimg.com/js/share/filters.js"></script>
<script>
$(window).load(function(){
	//显示弹出层 高度适配
	var windowH=$(window).height();
	var scrollH=$('.activedetail')[0].scrollHeight;
	$('.join-a').click(function(){
		if(windowH+150>scrollH){
				$('.information').height(windowH+150).show();
		}else{
			$('.information').height(scrollH).show();
		}
//		$('.info-form').css('top',$('.activedetail').scrollTop()+windowH*30/100);
		$('.info-form').css('top',($('body').height()-$('.info-form').height())/2);
	});
	//隐藏弹出层
	$('.close').click(function(){
		$(this).parent().parent('.pop').hide();
	});	
	//切换 报名按钮 颜色
	$('input.text').keyup(function(){
		checkform();
	});
//	$('textarea').keyup(function(){
//		checkform();
//	});
});
var checkOk=false;
function checkform(){
	if($('input.text').val()!=''){
		$('.button').addClass('button-change');
		checkOk=true;
	}else{
		$('.button').removeClass('button-change');
		checkOk=false;
	}
}
$('.button').click(function(){
	if(checkOk){
		$('.join-a').addClass('joined-a').html('已报名');
		$('.information').hide();
		$('.cancleJon').show();
		setTimeout(function(){$('.cancleJon').hide();},2000);
	}
});
//取消报名
$('joined-a').click(function(){
	
});
</script>